<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2018/7/8
  Time: 15:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <jsp:include page="/static/common/easyui_header.jsp"></jsp:include>

    <script>
        function formatterStatus(value, row, index) {
            if(value==1){
                return "<span style='color:green'>启用</span>"
            }else{
                return "<span style='color:red'>停用</span>"
            }
        }
        $(function () {
            //弹窗渲染  classroom_add_linkbuttons
            $("#classroom_add_dialog").dialog({
                title: "添加",
                buttons: '#classroom_add_linkbuttons',
                closed: true

            });

            $('#classroom_daragrid').datagrid({
                url: '/classroom/list',
                fit: true,
                fitColumns: true,
                border: false,
                rownumbers: true,
                pagination: true,
                singleSelect: true,
                toolbar: "#classroom_linkbuttons",
                columns: [[
                    {field: 'name', title: '教室名称', width: 100},
                    {field: 'address', title: '地址', width: 100},
                    {field: 'seats', title: '座位数量', width: 100},
                    {field: 'status', title: '教室状态', width: 100,formatter: formatterStatus},
                    {field: 'remark', title: '教室标语', width: 100}
                ]],
                //当选中时
                onSelect:function (idex,data) {
                    if(data.status){
                        //如果是已经启用那么就改为停用
                        $("#enableClassroom").linkbutton({
                            text:"停用教室",
                            iconCls:"icon-disable"
                        })


                    }else{
                        $("#enableClassroom").linkbutton({
                            text:"启用教室",
                            iconCls:"icon-enable"
                        })
                    }
                }

                //否则
            });
            var cmdObj = {
                //添加教室
                addClassroom: function () {
                    //清除表单数据
                    $("#classroom_add_form").form("clear");
                    //设置标题
                    $("#classroom_add_dialog").dialog("setTitle", "添加教室");
                    //打开弹窗
                    $("#classroom_add_dialog").dialog("open");
                },
                reloadClassroom:function () {
                    $("#classroom_daragrid").datagrid("reload")
                },

                //添加教室和编辑教室上的确定按钮
                save: function () {
                    var url="/classroom/save";
                    //获取选中行id
                    var classroomId=$("#classroom_id").val();
                    if(classroomId){
                        url="/classroom/update";
                    }
                    $("#classroom_add_form").form('submit',{
                        url: url,
                        success: function (data) {
                           data=$.parseJSON(data)
                            if(data.success){

                                $.messager.alert("提示","保存成功","info",function () {
                                   //关闭窗口
                                    cmdObj.cancel();
                                    //刷新页面
                                    cmdObj.reloadClassroom();
                                })
                            }else{
                                $.messager.alert("提示",data.msg,"error");
                            }
                        }
                    });

                },
                //编辑编辑管理数据
                editClassroom:function () {
                    //获取选中行
                    var selectedRow=$("#classroom_daragrid").datagrid("getSelected")
                    if(!selectedRow){
                        $.messager.alert("提示","请选中一行数据进行操作","error")
                        return;
                    }
                    //读取选中行的数据进行回填
                    $("#classroom_add_form").form("load",selectedRow);
                    //设置标题
                    $("#classroom_add_dialog").dialog("setTitle", "编辑教室");
                    //打开弹窗
                    $("#classroom_add_dialog").dialog("open");

                },
                //删除功能
                removeClassroom:function () {
                    var selectedRow=$("#classroom_daragrid").datagrid("getSelected")
                    if(!selectedRow){
                        $.messager.alert("提示","请选中一行数据进行操作","error")
                        return;
                    }
                    $.messager.confirm("提示","你确定要删除吗?",function (yes) {
                        $.messager.alert("提示","删除功能不做啦....你再等等吧...","error")
                    })
                },
                //关闭dialog
                cancel:function () {
                    $("#classroom_add_dialog").dialog("close");
                },

                //启用教室
                EnableClassroom:function () {
                    var selectedRow=$("#classroom_daragrid").datagrid("getSelected")
                    if(!selectedRow){
                        $.messager.alert("提示","请选中一行数据进行操作","error")
                        return;
                    }

//                    if(selectedRow.status){
//
//                        $.messager.alert("提示","该教室已经被启用了!!!!","error")
//                        return;
//
//                    }
                    var status = selectedRow.status ? "停用"+[selectedRow.name]+"教室" : "启用"+[selectedRow.name]+"教室";
                    var statusNum = selectedRow.status ? 0 : 1;
                    $.messager.confirm("提示","你确定要"+[status]+"吗?",function (yes) {
                        if (yes){
                            //传递两个参数一个是当前id,另一个是要操作的状态编号
                            $.post("/classroom/enableClassroom",{"id":selectedRow.id,statusNum:statusNum},function (data) {
                                if(data.success){
                                    $.messager.alert("提示",[status]+"成功","info",function () {
                                        //关闭窗口
                                        cmdObj.cancel();
                                        //刷新页面
                                        cmdObj.reloadClassroom();
                                    })
                                }
                            })
                        }
                    })
                }
            }
            //按钮点击事件
            $("a[data-cmd]").click(function () {
                var cmd = $(this).data("cmd");
                //cmdObj[cmd]  :根据cmd的值,找到 cmdObj 对应的方法
                //cmdObj[cmd]() : () ,触发方法的执行
                cmdObj[cmd]();
            });
        })
    </script>
</head>
<body>
<%--教室管理表格--%>
<table id="classroom_daragrid"></table>
<%--增删改刷新--%>
<div id="classroom_linkbuttons">
    <a class="easyui-linkbutton" data-options="iconCls:'icon-add'" plain="true" data-cmd="addClassroom">增加</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-remove'" plain="true" data-cmd="removeClassroom">删除</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-edit'" plain="true" data-cmd="editClassroom">编辑</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-reload'" plain="true" data-cmd="reloadClassroom">更新</a>
    <a id="enableClassroom" class="easyui-linkbutton" data-options="iconCls:'icon-enabled'" plain="true" data-cmd="EnableClassroom">启用教室</a>
</div>
<div id="classroom_add_linkbuttons">
    <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" data-cmd="save">确定</a>
    <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel'" data-cmd="cancel">取消</a>
</div>
<%--新增和编辑的弹窗--%>
<div id="classroom_add_dialog" style="padding: 10px">
    <form id="classroom_add_form" method="post">
        <input type="hidden" name="id" id="classroom_id">
        <table>
            <tr>
                <td>教室名称</td>
                <td><input name="name" class="easyui-textbox"></td>
            </tr>

            <tr>
                <td>教室地址</td>
                <td><input name="address" class="easyui-textbox"></td>
            </tr>
            <tr>
                <td>教室座位数</td>
                <td><input name="seats" class="easyui-textbox"></td>
            </tr>
           <%--暂时教室状态全部为未开启状态,当教室开课选择教室后教室自动启用--%>
            <tr>
                <td>教室标语</td>
                <td><input name="remark" class="easyui-textbox" data-options="multiline:true"
                           style="width:300px;height:100px"></td>
            </tr>

        </table>
    </form>
</div>
</body>
</html>
